<template>
  <div>

    <div>
      <div class="page-title">
        <span>编辑卡车类型</span>
        <a id="back_a"  @click="back()">返回上一页</a>
      </div>
    </div>

    <el-form :model="form" :rules="rules" ref="truckEngineForm" label-width="120px"  v-loading="form.loading">

      <el-row type="flex" class="row-bg">
        <el-col :span="12">
          <el-form-item label="发动机名称:" prop="name">
            <el-input v-model="form.name"></el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row type="flex" class="row-bg">
        <el-col :span="12">
          <el-form-item label="排序:" prop="sort">
            <el-input v-model="form.sort"></el-input>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row type="flex" class="row-bg">
        <el-col :span="12">
          <el-form-item label="是否有效">
            <el-switch
                    v-model="form.isDeleted"
                    active-text="是"
                    inactive-text="否">
            </el-switch>
          </el-form-item>
        </el-col>
      </el-row>

      <el-row type="flex" class="row-bg">
        <el-col :span="12">
          <el-form-item>
            <el-button type="primary" @click="saveTruckEngine()">保存</el-button>
          </el-form-item>
        </el-col>
      </el-row>

    </el-form>
  </div>
</template>

<script>
    export default {
        name:'TruckEngineEditor',
        data() {
            return {

                form: {
                    name:'',sort:0,isDeleted:true,  truckEngineId:0
                },
                rules: {
                    name: [{ required: true, message: "发动机不能为空",trigger: "blur"}],
                    sort:    [{ required: true, message: "排序不能为空",trigger: "blur"}]
                }
            }
        },
        methods: {
            back(){
                this.$router.push({name:'TruckEngineList'});
            },
            saveTruckEngine(){
                this.$refs.truckEngineForm.validate(valid => {
                    if (!valid) {
                        return false;
                    }
                    this.form.loading=true;
                    let params = this.form;
                    this.$api.saveOrUpdateTruckEngine(params).then(response=>{
                        let result = response.data;
                        if(result.code==0){
                            this.$message({  type: 'success',message: '保存成功!'});
                            this.$router.push({name:'TruckEngineList'});
                        }else{
                            this.$message({  type: 'error',message:result.data});
                        }
                        this.form.loading=false;
                    });
                });
            }
        },
        mounted() {

        },
        created() {
            let params =  this.$route.params;
            if(params&&params.truckEngineId){
                this.$api.getTruckEngineInfo(params).then(response=>{
                    let result = response.data;
                    if(result.code==0){
                        this.form =  result.data;
                        this.form.truckEngineId = params.truckEngineId;
                    } else {
                        this.$message({  type: 'error',message:response.data.msg});
                    }
                });
            }
        }
    }
</script>
